<template>
	<view class="pb40">
		<u-navbar title="车辆基本信息"></u-navbar>

		<view class="m15 p15 bg-fff br5">
			<view class="dis-flex">
				<view class="wd50 dis-flex flex-align-center" style="height: 100rpx;">
					<view class=" fs14" style="width: 260rpx;">牌照号码：</view>
					<view class=" bb fs14">
						<u-input :clearable="false" v-model="chepai" type="text" placeholder="请输入牌照号码" />
					</view>
				</view>
				<view class="wd50 dis-flex flex-align-center" style="height: 100rpx;">
					<view class=" fs14" style="width: 260rpx;">车辆型号：</view>
					<view class="bb">
						<u-input :clearable="false" v-model="xinghao" type="text" placeholder="请输入车辆型号" />
					</view>
				</view>
			</view>

			<view class="dis-flex">
				<view class="wd50 dis-flex flex-align-center" style="height: 100rpx;">
					<view class=" fs14" style="width: 260rpx;">制造年月：</view>
					<view class=" bb">
						<u-input :clearable="false" @click="xianshi()" v-model="time" type="text" placeholder="请选择制造年月"
							:disabled="true" />
					</view>
				</view>
				<view class="wd50 dis-flex flex-align-center" style="height: 100rpx;">
					<view class="fs14" style="width: 260rpx;">表里里程：</view>
					<view class="bb">
						<u-input :clearable="false" v-model="licheng" type="text" placeholder="请输入表里里程" />
					</view>
				</view>
			</view>
			<view class=" dis-flex flex-align-center" style="height: 100rpx;">
				<view class="wd30 fs14">发动机型号：</view>
				<view class="wd70 bb">
					<u-input :clearable="false" v-model="fadong_xinghao" type="text" placeholder="请输入发动机型号" />
				</view>
			</view>
			<view class=" dis-flex flex-align-center" style="height: 100rpx;">
				<view class="wd25 fs14">VIN码：</view>
				<view class="wd75 bb">
					<u-input :clearable="false" v-model="vin" type="text" placeholder="请输入VIN码" />
				</view>
			</view>

			<!-- 		<view class=" dis-flex flex-align-center" style="height: 100rpx;">
				<view class="wd25 fs14">使用性质：</view>

				<view class="dis-flex flex-end wd75">
					<u-radio-group v-model="is_xingzhi" :size="29">
						<u-radio @change="radioChange1" v-for="(item, index) in shiyong_list" :key="index"
							:name="item.name" :disabled="item.disabled" :label-size="22">
							{{item.name}}
						</u-radio>
					</u-radio-group>
				</view>
			</view> -->
			<view class=" dis-flex flex-align-center" style="height: 100rpx;">
				<view class="wd40 fs14">是否重大事故车：</view>
				<view class="dis-flex flex-end wd60">
					<u-radio-group v-model="is_shigu" :size="35">
						<u-radio @change="radioChange2" v-for="(item, index) in shigu_list" :key="index"
							:name="item.name" :disabled="item.disabled" :label-size="24">
							{{item.name}}
						</u-radio>
					</u-radio-group>
				</view>
			</view>
			<view class=" dis-flex flex-align-center" style="height: 100rpx;">
				<view class="wd40 fs14">是否泡水车：</view>
				<view class="dis-flex flex-end wd60">
					<u-radio-group v-model="is_shui" :size="35">
						<u-radio @change="radioChange3" v-for="(item, index) in shui_list" :key="index"
							:name="item.name" :disabled="item.disabled" :label-size="24">
							{{item.name}}
						</u-radio>
					</u-radio-group>
				</view>
			</view>
			<view class=" dis-flex flex-align-center" style="height: 100rpx;">
				<view class="wd40 fs14">是否火烧车：</view>
				<view class="dis-flex flex-end wd60">
					<u-radio-group v-model="is_huo" :size="35">
						<u-radio @change="radioChange4" v-for="(item, index) in huo_list" :key="index" :name="item.name"
							:disabled="item.disabled" :label-size="24">
							{{item.name}}
						</u-radio>
					</u-radio-group>
				</view>
			</view>
			<view class=" dis-flex flex-align-center" style="height: 220rpx;">
				<view class="wd25 fs14">备注：</view>
				<view class="wd75 bb fs14">
					<u-input :clearable="false" v-model="jielun" type="textarea" placeholder="请输入备注" :border="true"
						:height="190" :maxlength="80" />
				</view>
			</view>
		</view>
		<view @click="xiabu" class="m15 br5 c-fff center fw600"
			style="background-color: #1d336f;height: 90rpx;line-height: 90rpx;">
			下一步
		</view>
		<!-- <u-calendar v-model="show" mode="date" @change="timechange"></u-calendar> -->
		<selectTimer @changeTime="changeTime" :visible="visible" @timeCofirm="timeCofirm"></selectTimer>
	</view>
</template>

<script>
	import selectTimer from "@/components/select-timer/select-timer.vue"
	export default {
		components: {
			selectTimer
		},
		data() {
			return {
				visible: false,
				year: '',
				moth: '',
				chepai: '', //牌照号码
				xinghao: '', //车辆型号
				fadong_xinghao: '', //发动机型号
				vin: '', //VIN码
				time: '', //制造年月
				licheng: '', //表里里程
				suoyou: '', //车辆所有人
				phone: '', //联系电话
				is_xingzhi: '', //使用性质
				is_shigu: '', //是否为事故车
				is_shui: '', //是否泡水车
				is_huo: '', //是否火烧车
				jielun: '', //备注
				shiyong_list: [{
						name: '非运营',
						disabled: false
					},
					{
						name: '运营',
						disabled: false
					},
					{
						name: '营转非',
						disabled: false
					},
					{
						name: '其他',
						disabled: false
					}
				],
				shigu_list: [{
						name: '是   ',
						disabled: false
					},
					{
						name: '否',
						disabled: false
					},
				],
				shui_list: [{
						name: '是   ',
						disabled: false
					},
					{
						name: '否',
						disabled: false
					},
				],
				huo_list: [{
						name: '是   ',
						disabled: false
					},
					{
						name: '否',
						disabled: false
					},
				],
				bgco: {
					'background-color': '#CCECF8'
				},
				oid: ''
			}
		},
		onLoad(e) {
			this.oid = e.oid
			this.init()
		},
		methods: {
			changeTime(e) {
				this.year = e[0] + 1970
				this.moth = e[1] + 1
			},
			timeCofirm(type) {
				if(type == 1){
					this.time = this.year +"-"+this.moth
				}
				this.visible = false
			},
			init() {
				var json = {
					oid: this.oid
				}
				this.$http.post(this.$config.UrlPostreportInfo, json).then((res) => {
					if (res.status == 1 && res.data) {
						this.chepai = res.data.car_num //牌照号码
						this.xinghao = res.data.brand //车辆型号
						this.fadong_xinghao = res.data.engine //发动机型号
						this.vin = res.data.vin_number //VIN码
						this.time = res.data.make_date //制造年月
						this.licheng = res.data.mileage //表里里程
						this.suoyou = res.data.name //车辆所有人
						this.phone = res.data.phone //联系电话
						this.is_xingzhi = res.data.use_model //使用性质
						this.is_shigu = res.data.is_shigu //是否为事故车
						this.is_shui = res.data.is_paoshui //是否泡水车
						this.is_huo = res.data.is_huoshao //是否火烧车
						this.jielun = res.data.result //备注
					}
				})
			},
			xiabu() {
				// if (this.chepai && this.xinghao && this.fadong_xinghao && this.vin && this.time && this.licheng && this
				// 	.suoyou && this.phone && this.is_xingzhi && this.is_shigu && this.is_shui && this.is_huo && this.jielun
				// ) {
					var json = {
						oid: this.oid,
						car_num: this.chepai, //牌照号码
						brand: this.xinghao, //车辆型号
						engine: this.fadong_xinghao, //发动机型号
						vin_number: this.vin, //VIN码
						make_date: this.time, //制造年月
						mileage: this.licheng, //表里里程
						name: this.suoyou, //车辆所有人
						phone: this.phone, //联系电话
						use_model: this.is_xingzhi, //使用性质
						is_shigu: this.is_shigu, //是否为事故车
						is_paoshui: this.is_shui, //是否泡水车
						is_huoshao: this.is_huo, //是否火烧车
						result: this.jielun, //备注
					}
					this.$http.post(this.$config.UrlPostreportCreate, json).then((res) => {
						if (res.status == 1) {
							this.$api.openWindow("/pages/detection/detection?oid=" + this.oid)
							// this.$api.openWindow("/pages/baogao/baogao?oid=" + this.oid)
						}
					})
				// } else {
				// 	this.$api.toast('请完善车辆信息')
				// }

			},
			xianshi() {
				// this.show = !this.show
				this.visible = true
			},
			// radioChange1(e) {
			// 	this.is_xingzhi = e
			// },
			radioChange2(e) {
				this.is_shigu = e
			},
			radioChange3(e) {
				this.is_shui = e
			},
			radioChange4(e) {
				this.is_huo = e
			},
			timechange(e) {
				this.time = e.result
			}
		}
	}
</script>

<style>
	page {
		background: #f1f1f1;
		color: #333333;
	}
</style>
